import { Button, Modal, Select, message, Checkbox, Input, Radio } from "antd"
import { Form } from '@ant-design/compatible';
import { connect } from "dva"
import React from "react"
import moment from "moment"
const FormItem = Form.Item
const { Option } = Select
import { routerRedux } from "dva/router";
const { TextArea } = Input

@connect((state) => ({
  menu: state.menu,
  creditCar: state.creditCar,
}))
class MsgRulerModal extends React.Component {
  state = {
    
  };

  componentDidMount () { }

  handleOk = () => {
    const { dispatch, form, record, ruleListType = 1 } = this.props;
    form.validateFields({ force: true }, (err, values) => {
      if (err) {
        return
      }
      let params = {
        businessCode: this.props.businessCode,
        vin: record.vin,
        iviNoticeUuid: values.iviNoticeUuid
      }
      if(this.props.businessId){
        params.businessId = this.props.businessId
      }
      if (ruleListType == 2) {
        const payload = {
          url: "/mscreditbusiness/vehicle/lock/set",
          vin: record.vin,
          businessCode: this.props.businessCode,
          iviNoticeUuid: values.iviNoticeUuid
        }
        if(this.props.businessId){
          payload.businessId = this.props.businessId
        }
        this.props.dispatch({
          type: "creditCar/postDataWithRes",
          payload: payload,
          callback: (response) => {
            if (response && response.statusCode == "0") {
              message.success("操作成功");
              this.onOK()
            } else {
              // message.error(response.statusMessage);
            }
          },
        });
      } else if (ruleListType == 3) {
        let payload = {
          url: "/mscreditbusiness/vehicle/limp/set",
          vin: record.vin,
          businessCode: this.props.businessCode,
          iviNoticeUuid: values.iviNoticeUuid
        }
        if(this.props.businessId){
          payload.businessId = this.props.businessId
        }
        this.props.dispatch({
          type: "creditCar/postDataWithRes",
          payload: payload,
          callback: (response) => {
            if (response && response.statusCode == "0") {
              message.success("操作成功");
              this.onOK()
            } else {
              // message.error(response.statusMessage);
            }
          },
        });
      } else {
        
        this.props.dispatch({
          type: "creditCar/postDataWithRes",
          payload: {
            url: "/mscreditbusiness/vehicle/ivi/warn",
            ...params,
          },
          callback: (response) => {
            if (response.statusCode === "0") {
              message.success("发送成功")
              this.onOK()
            } else {
              // message.error(response.statusMessage)
            }
          }
        })
      }

    })
  };
  onOK = () => {
    
    const { form, onOk } = this.props
    form.resetFields()
    onOk && onOk()
  }
  onCancel = () => {
    const { form, changeVisible } = this.props
    form.resetFields()
    changeVisible()
  };
  onNewRuler = () => {
    this.props.dispatch(routerRedux.push({
        pathname: '/creditPlatform/deviceWarningRules'
      }));
  }
  render () {
    const { getFieldDecorator } = this.props.form

    const { visible, changeVisible, } = this.props
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 24 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 24 },
      },
    }
    return (
      <Modal
        title="车机告警"
        width={550}
        onCancel={() => changeVisible()}
        visible={visible}
        footer={[
          <Button key="back" size="default" onClick={this.onCancel}>
            取消
          </Button>,
          <Button key="submit" type="primary" size="default" onClick={this.handleOk}>
            确认
          </Button>
        ]}
      >
        <Form>
          <div>请选择车机告警规则:</div>
          <FormItem {...formItemLayout}>
            {getFieldDecorator('iviNoticeUuid', {
              rules: [{ required: true, message: '请选择车机告警规则' }],
            })(
              <Select
                style={{width: '350px'}}
                allowClear
                placeholder='请选择'
              >
                {this.props.ruleList.map(i => (
                  <Option key={`alert${i.uuid}`} value={i.uuid}>{i.name}</Option>
                ))}
              </Select>,
            )}
            <a onClick={this.onNewRuler} style={{paddingLeft: '20px'}}>去新建规则</a>
          </FormItem>
        </Form>
        <div style={{color: 'red', padding: '10px 10px'}}>
          <p>注意：</p>
          <p>1，若车辆已经实施跛行或锁车，则必须发送车机告警</p>
          <p>2，若车辆已经实施跛行或锁车，则车机告警规则不能使用弱提醒</p>
        </div>
      </Modal>
    )
  }
}

export default connect()(Form.create()(MsgRulerModal))
